<!--suppress ALL -->
<include file="./Template/header.html" />
<link rel="stylesheet" type="text/css" href="/Template/css/paymentList.css?v=2022101707">
<script type="text/javascript">

    $(function() {

        //初始化页面配置
        initPage("支付订单");

        var app = new Vue({
            el: '#container',
            data: {
                paymentList: [],
            },
            methods: {
                checkRole: function(employeeRoleId, roleId) {
                    var employeeRoleArr = employeeRoleId.split(",");
                    var roleArr = roleId.split(",");

                    var result = false;
                    $.each(roleArr, function(i,val){
                        if($.inArray(val, employeeRoleArr) != -1 || $.inArray((parseInt(val)+100).toString(), employeeRoleArr) != -1){
                            result = true;
                        }
                    });
                    return result;
                },
            }
        })

        function getPaymentList(status, ignorePaymentId) {

            $.ajax({
                url:"/wechat/payment/myPaymentList",
                type:"post",
                data:{
                    status: status,
                    paymentId: '{$paymentId}',
                    ignorePaymentId: ignorePaymentId,
                },
                dataType:"JSON",
                beforeSend:function(){
                    $("#loadingToast").show();
                },
                complete:function(){
                    $('#loadingToast').hide();
                },
                success:function(data){
                    app.paymentList = data;
                    setTimeout(function() {
                        $(".ui-item.measure-info img").bind("click", function() {
                            var upUrl = "/Template/images/icon-up.png";
                            var downUrl = "/Template/images/icon-down.png";
                            $(this).parent().next().toggle();
                            if($(this).attr("src") == upUrl) {
                                $(this).attr("src", downUrl);
                            } else {
                                $(this).attr("src", upUrl);
                            }
                        });
                        $(".ui-item.measure-info img").each(function() {
                            $(this).trigger("click");
                        });
                    },200);
                },
            })
        }

        $("#my-order ul li").bind("click", function() {

            if($(this).hasClass("active")) {
                return false;
            }

            var status = $(this).attr("data-status");

            $("#my-order ul li").each(function() {
                $(this).removeClass("active");
            });

            $(this).addClass("active");

            getPaymentList(status, 1);

        });


        if(isNullOrEmpty("{$paymentId}")){
            getPaymentList(0);
        }else{
            getPaymentList();
            $(".li-status-1").removeClass("active");
            $(".li-status1").removeClass("active");
            $(".li-status0").removeClass("active");
            switch('{$paymentStatus}'){
                case '-1':
                    $(".li-status-1").attr("class","active");
                    break;
                case '1':
                    $(".li-status1").attr("class","active");
                    break;
                case '0':
                    $(".li-status0").attr("class","active");
                    break;
            }
        }

//        if (window.history && window.history.pushState) {
//            $(window).on('popstate', function () {
//                window.history.pushState('forward', null, '#');
//                window.history.forward(1);
//            });
//        }
//        window.history.pushState('forward', null, '#'); //在IE中必须得有这两行
//        window.history.forward(1);


    });


</script>
<div class="container" id="container">
    <div id="my-order">
        <ul>
            <!--li class="li-status-5" data-status="-5">
                <span>未付款</span>
            </li-->
            <li class="li-status-1" data-status="-1">
                <span>未付款</span>
            </li>
            <li class="li-status1" data-status="1">
                <span>已付款</span>
            </li>
            <li class="li-status0 active" data-status="0">
                <span>全部</span>
            </li>
        </ul>
    </div>
    <div class="order-detail">
        <div class="no-data" v-if="paymentList == null">暂无数据</div>
        <div class="order-info" v-for="order in paymentList">
            <div class="status active" v-if="order.status == -1">
                <img src="/Template/images/icon-waiting.png" alt="">
                <span class="status-content"><a v-if="order.type == 'wangjing'">望京医院 </a>(未付款)</span>
            </div>
            <div class="status active" v-if="order.status == 1">
                <img src="/Template/images/icon-clock.png" alt="">
                <span class="status-content"><a v-if="order.type == 'wangjing'">望京医院 </a>(已付款)</span>
            </div>
            <div class="status active" v-if="order.status == -2">
                <img src="/Template/images/icon-clock.png" alt="">
                <span class="status-content"><a v-if="order.type == 'wangjing'">望京医院 </a> (已关闭)</span>
            </div>
            <div class="have-padding">
                <div class="user-order-info">
                    <div style="height: 0.3rem"></div>
                    <div class="ui-item pickUp-info">
                        <span class="item-left">下单时间</span>
                        <span class="item-right">{{order.create_time}}</span>
                    </div>
                    <div class="ui-item pickUp-info">
                        <span class="item-left">交易单号</span>
                        <span class="item-right">{{order.pay_trade_no}}</span>
                    </div>
                    <div class="ui-item pickUp-info">
                        <span class="item-left">付款时间</span>
                        <span class="item-right" style="color: #45a1de;">{{order.pay_time}}</span>
                    </div>
                    <div class="ui-item pickUp-info">
                        <span class="item-left">金额</span>
                        <span class="item-right" style="color: #d92f3b;font-weight: bold">￥{{order.amount}}</span>
                    </div>
                    <div class="ui-item pickUp-info">
                        <span class="item-left">姓名</span>
                        <span class="item-right" style="color: #1dccaa;">{{order.name}}</span>
                    </div>
                    <div class="ui-item pickUp-info" v-if="order.nickname != ''">
                        <span class="item-left">付款人</span>
                        <span class="item-right">{{order.nickname}}</span>
                    </div>
                    <div class="ui-item messege-left" v-if="order.payment_content != ''">
                        <span class="item-left">留言备注</span>
                        <span class="item-right" style="color: #e97a15;">{{order.payment_content == "" ? "暂无":order.payment_content}}</span>
                    </div>
                    <!--div class="ui-item messege-left" v-if="order.need_invoice == -1">
                        <span class="item-left">发票</span>
                        <span class="item-right">不要发票</span>
                    </div-->
                </div>
                <div class="finishedProduct-detail-info" v-if="order.need_invoice > 0">
                    <div class="ui-item measure-info">
                        <span class="item-class"> </span>
                        <span class="item-detailname">发票信息</span>
                        <img class="icon-up" src="/Template/images/icon-up.png" alt="">
                    </div>
                    <div>
                        <div class="ui-item invoice-name" v-if="order.need_invoice == 1">
                            <span class="item-left">发票类型</span>
                            <span class="item-right" style="color: #45a1de;">公司</span>
                        </div>
                        <div class="ui-item invoice-name" v-if="order.need_invoice == 1">
                            <span class="item-left">发票抬头</span>
                            <span class="item-right">{{order.invoice_name}}</span>
                        </div>
                        <div class="ui-item invoice-name" v-if="order.need_invoice == 1">
                            <span class="item-left">纳税人识别号</span>
                            <span class="item-right">{{order.invoice_number}}</span>
                        </div>
                        <div class="ui-item invoice-name" v-if="order.need_invoice == 2">
                            <span class="item-left">发票类型</span>
                            <span class="item-right" style="color: #45a1de;">个人</span>
                        </div>
                        <div class="ui-item invoice-name" v-if="order.need_invoice ==2">
                            <span class="item-left">发票明细</span>
                            <span class="item-right">{{order.invoice_name}}</span>
                        </div>
                        <div class="ui-item invoice-name">
                            <span class="item-left">电话</span>
                            <span class="item-right">{{order.receive_contact}}</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<include file="./Template/footer.html" />

